<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>代约团课</title>
	<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no"
		name="viewport">
	<link rel="stylesheet" href="css/weui.min.css">
	<link rel="stylesheet" href="css/jquery-weui.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/bosscoach.css">
	<link rel="stylesheet" href="css/membership.css">
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/bossIndex.css">
	<link rel="stylesheet" href="css/flexible.css">
	<link rel="stylesheet" href="css/vant.css">
	<script src="js/vue.js"></script>
	<script src="js/axios.js"></script>
	<script src="js/vant.js"></script>
	<script src="js/jquery.md5.js"></script>
	<script src="js/qs.js"></script>
	<script src="js/jquery-3.3.1.min.js"></script>
	<script src="js/fontsize.js"></script>
	<script src="js/comment.js"></script>
	<script src="js/glabe.js"></script>
	<script src="js/jquery.min.js"></script>
	<script src="js/flexible.js"></script>
	<script src="js/fitnesslist.js"></script>
</head>
<body>
	<div id="app">
		<div class="courseDateDiv clearfix Substitution_header">
			<p class="courseDateShow-span fl" id="courseDateShow"></p>
			<div class="courseDate-icon fr">
				<img src="images/calendar_icon.png" alt="">
				<input class="courseDate-input" id="courseDate_input" inputreadonly="true" readonly="readonly">
			</div>
		</div>
		<div class="courseDate-panel">
			<ul class="course-week clearfix">
				<li>日</li>
				<li>一</li>
				<li>二</li>
				<li>三</li>
				<li>四</li>
				<li>五</li>
				<li>六</li>
			</ul>
			<div class="swiper-container">
				<div class="swiper-wrapper" id="course_date">
				</div>
			</div>
		</div>
		<div class="Substitution_list Substitution_course" v-for="item in dataList" :key="item.id">
			<div class="group_details group_details_state clearfix" style="padding-right: 0.5rem;">
				<div class="fl"><img :src="item.picurl" alt="" class="spinning_img"></div>
				<div class="spinning_txt fl" style="padding-top:0;">
					<p><span class="spinning_txx">{{item.title}}</span><span class="spinning_name">{{item.Sname}}</span></p>
					<p><span class="spinning_date">{{item.stime}}-{{item.etime}}</span></p>
					<p class="degree">{{item.yyNum}}/{{item.max}} <span class="many_full">预约满{{item.min}}人开课</span></p>
				</div>
				<div v-if="item.yy_state==1" class="appointment fr"><a  style="color: #fff;" @click="dataInof(item.id,item.plan_id,item.key,item.date,item.currid)" >预约</a></div> 
				 <!-- selectCard.html -->
				<div v-if="item.yy_state==0" class="appointment fr" style="background-color: #fff;"><a href="#" style="color: #ddd;" >已过时</a></div>
				<div v-if="item.yy_state==2" class="appointment fr" style="background-color: #fff;"><a href="#" style="color: #ddd;" >预约人数已满</a></div>
				<div v-if="item.yy_state==3" class="appointment fr" style="background-color: #fff;"><a href="#" style="color: #ddd;" >已经预约</a></div>
				<div v-if="item.yy_state==4" class="appointment fr" style="background-color: #fff;"><a href="#" style="color: #ddd;" >已签到待评价课程 </a></div>
				<div v-if="item.yy_state==5" class="appointment fr" style="background-color: #fff;"><a href="#" style="color: #ddd;" >已违约</a></div>
			</div>
		</div>
		<div class="technicalSupport">由馆家提供技术支持</div>
		<div class="footer_bar Substitution_footer">
			<ul class="clearfix">
				<li>
					<a href="javascript:void(0);" class="first_a">
						<p>首页</p>
					</a>
				</li>
				<li>
					<a href="javascript:void(0);" class="second_a foot_active">
						<p>团课</p>
					</a>
				</li>
				<li>
					<a href="javascript:void(0);" class="thrid_a">
						<p>私教</p>
					</a>
				</li>
				<li>
					<a href="javascript:void(0);" class="four_a">
						<p>更多</p>
					</a>
				</li>
			</ul>
		</div>
	</div>

	<script src="js/jquery-weui.js"></script>
	<script src="js/swiper.min.js"></script>
	<script>
		var app = new Vue({
			el: '#app',
			data: {
				dataList:[],
				uid:'',
				newDate: '',
			},
			watch: {
         newDate(){
			this.getList();
         },
      },
			created() {
				var uid = getUrlQueryString("uid")
				this.uid=uid
					axios.get(`mobileapi/boss/curr.php?act=tkList&uid=${uid}`).then(res => {
					//	console.log(res)
					var dataList = res.data.data
					this.dataList=dataList
					//console.log(dataList);
				}).catch(err => {
					vant.Toast('请求发送失败，请重试');
				})
			},
			mounted() {

			},
			methods: {
				getList(){
							var uid = getUrlQueryString("uid")
							this.uid=uid
							axios.get(`mobileapi/boss/curr.php?act=tkList&uid=${uid}&date=${this.newDate}`).then(res => {
							//	console.log(res)
							var dataList = res.data.data
							this.dataList=dataList
							//console.log(dataList);
						}).catch(err => {
							vant.Toast('请求发送失败，请重试');
						})
					},
				dataInof(uid,plan_id,key,date,currid){
					var data={
						uid:this.uid,  //会员id
						plan_id:plan_id,  //课程计划表id
						key:key,  //课程key值
						date:date,  //课程预约日期 2019-09-19
						currid:currid  //课程预约表id    selectCard.html
					}
					var  datas= JSON.stringify(data);
					window.location.href=`selectCard.html?data=${datas}`
				
					
				}
			}
		})
	</script>
</body>

</html>